<style lang="less" scoped>
.pageview {
    height: 100%;
    .comphead {
        position: fixed;
        width: 100%;
        height: 0.44rem;
        top: 0;
        left: 0;
        z-index: 10000;
    }
}
</style>
<template>
    <div class="pageview workbench">
        <CompHead class="comphead" @goSearch="goSearch" />
        <CompList
            :list="list"
            :pageData="pageData"
            :status="status"
            @onSel="onSel"
            @onBottom="onBottom"
        />
        <CompFooter
            @onSellAll="onSellAll"
            @onReject="clickShowModel"
            @onResovle="onResovle"
            :pageData="pageData"
        />
        <ModelReject v-model="showModel" @onOk="onOk" />
        <Search v-show="showSearch" v-model="showSearch" @onSearch="onSearch" @onCancle="onCancle" />
    </div>
</template>
<script>
import moment from "moment";
import CompHead from "./comp/head";
import CompList from "./comp/list";
import CompFooter from "./comp/foooter";
import Search from "./search";
import ModelReject from "@/components/modelReject";
import { getEmployeeList, auditEmployee } from "@/api";

export default {
    data() {
        return {
            showSearch: false,
            keyrowd: "", // 搜索关键字
            showModel: false,
            list: [],
            pageData: {},
            pageIndex: 0,
            pageSize: 20,
            status: 1,
        };
    },
    components: {
        CompHead,
        CompList,
        CompFooter,
        ModelReject,
        Search
    },

    methods: {
        // 获取列表
        getList() {
            this.status = 2;
            var pars = {
                page: this.pageIndex,
                pagecount: this.pageSize,
                type: 1,
                name: this.keyrowd
                // shop_name: this.keyrowd
            };
            getEmployeeList(pars).then(res => {
                if (res.code == 1) {
                    var data = res.data;
                    var list = data.data;
                    list.forEach(row => {
                        row._sel = false;
                        // row.time = moment(row.createTime * 1000).format("YYYY-MM-DD HH:mm:ss")
                    });
                    this.list = this.list.concat(list);

                    var pageData = {
                        selCount: 0,
                        len: list.length,
                        maxNum: data.count
                    };
                    this.pageData = pageData;

                    if (this.list.length == pageData.maxNum) {
                        this.status = 3;
                    } else {
                        this.status = 1;
                    }
                }
            });
        },

        // 全选和反选
        onSellAll(status) {
            // status: false表示全部取消， true表示全部选中
            this.list.forEach(row => {
                row._sel = status;
            });
        },
        // 点击驳回 需要弹窗写理由
        clickShowModel() {
            var id = "";
            this.list.forEach(row => {
                if (row._sel) {
                    id = row.id;
                }
            });
            if (!id) {
                this.$toast("请选择一条商品！");
                return false;
            }
            this.showModel = true;
        },

        // 确认驳回
        onOk(msg) {
            var id = "";
            this.list.forEach(row => {
                if (row._sel) {
                    id = row.id;
                }
            });
            if (!id) {
                this.$toast("请选择一个员工！");
                return false;
            }
            var data = {
                id: [id],
                type: 2,
                reject: msg
            };
            auditEmployee(data).then(res => {
                if (res.code == 1) {
                    this.$toast("员工已驳回");
                    setTimeout(() => {
                        this.$router.back(-1);
                    }, 500);
                } else {
                    this.$toast(res.msg);
                }
            });
        },

        // 点击确定
        onResovle() {
            var id = [];
            this.list.forEach(row => {
                if (row._sel) {
                    id.push(row.id);
                }
            });
            if (id.length == 0) {
                this.$toast("请至少选择一条数据！");
                return false;
            }
            var data = {
                id: id,
                type: 1,
                reject: ""
            };
            auditEmployee(data).then(res => {
                if (res.code == 1) {
                    this.$toast("审核通过");
                    setTimeout(() => {
                        this.$router.back(-1);
                    }, 500);
                } else {
                    this.$toast(res.msg);
                }
            });
        },

        // 列表中的单独勾选
        onSel(idx) {
            var row = this.list[idx];
            row._sel = !row._sel;
        },

        // 滚动到底部
        onBottom() {
            console.log("onBottom")
            this.pageIndex++;
            this.getList();
        },

        // 点击搜索图标，打开搜索界面
        goSearch() {
            this.showSearch = true;
        },

        // 搜索界面传递关键字过来进行搜索
        onSearch(keyrowd) {
            this.list = [];
            this.keyrowd = keyrowd;
            this.getList();
            this.showSearch = false;
        },

        // 搜索界面取消搜索
        onCancle() {
            this.showSearch = false;
        }
    },
    watch: {
        list: {
            deep: true,
            handler: function (val) {
                var i = 0;
                val.forEach(row => {
                    if (row._sel) {
                        i++;
                    }
                });
                this.pageData.selCount = i;
            }
        }
    },
    mounted() {
        // this.getList();
    }
};
</script>
